<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <style>
        * {
            margin: 0;
            padding: 0;
        }
        
        body {
            padding: 100px;
        }
        
        textarea {
            width: 500px;
            height: 100px;
            border: 1px solid green;
			border-radius:3px;
            outline: none;
            resize: none;
			vertical-align: bottom;
        }
        button{
			width:90px;
			height:35px;
			background-image: linear-gradient(to bottom, #adb1b5, #bdc0c4);
			border-radius: 3px;
			border:none;
			color:#fff;
			margin-left:10px;
			cursor:pointer;
		}
        ul {
            margin-top: 50px;
        }
        
        li {
            width: 500px;
            padding: 5px;
            color: red;
            font-size: 14px;
            margin: 15px 0;
			border-bottom:1px dashed #ADB1B5;
			list-style:none;
			overflow: hidden;
        }
		li span:nth-child(1){
			float: left;
			font-size:15px;
			color: blue;
		}
		li span:nth-child(2){
			float: right;
			font-size:15px;
		}		
    </style>
</head>

<body>
    <textarea name=""></textarea><button>发布</button>
    <ul></ul>
	<script type="text/javascript">
		//获取按钮元素对象
		var btn = document.querySelector('button');
		//获取文本域对象
		var txt = document.querySelector('textarea');
		//获取ul父节点
		var ul = document.querySelector('ul');
		//绑定点击事件
		btn.onclick = function(){
			var val = txt.value;
			//简单判断
			if(val==''||val.length==0||val==undefined||val==null){
				alert('请输入文本内容!');
			}else{
				//创建节点
				var oli = document.createElement('li');
				var ymd = ymdhis();
				oli.innerHTML = '<span>'+val+'</span><span>'+ymd+'</span>';
				ul.insertBefore(oli,ul.children[0]);
			}
		}
		
		function ymdhis(){
			//实例化日期对象(构造函数,需要借助关键字new去实例化)
			var date = new Date();
			//获取年
			var year = date.getFullYear();
			//获取月份[0,11]
			var month = date.getMonth()+1;
			//获取哪一天
			var day = date.getDate();
			
			console.log(year+'='+month+'='+day);
			//星期几？
			var weeks = ['星期天','星期一','星期二','星期三','星期四','星期五','星期六'];
			var week = weeks[date.getDay()];
			console.log(week);
			
			var ymd = year+'年'+month+'月'+day+'日'
			
			//时分秒
			var h = date.getHours();
			h = h<10 ? '0'+h : h;
			var i = date.getMinutes();
			i = i<10 ? '0'+i : i;
			var s = date.getSeconds();
			s = s<10 ? '0'+s : s;
			
			var his = h+'时'+i+'分'+s+'秒';
			
			return ymd+his;
		}
	</script>
</body>

</html>